<head>
    <title>图表</title>

   <!--对于eCharts在IE兼容模式中显示，需要指定meta元素中放入X-UA-Compatible ie=9标头，否则ECHART将失效，这个要根据实际需要，看要兼容到什么版本，据我测试IE9以上我用到的ECHART功能还行，8已经不行了-->
    <meta http-equiv="X-UA-Compatible" content="IE=9" />
	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
    <script src="echarts.min.js"></script>
</head>
<body>
    <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
    <div id="main" style="width: 800px;height:600px;"></div>

<script type="text/javascript">
    window.onload = function () {
 
var myChart = echarts.init(document.getElementById('main'));

var lineStyle = {
    normal: {
        width: 2,
        opacity: 0.5
    }
};


var dataSeries = eval('(' +window.external.dataSeries+ ')');
var schema = eval('(' +window.external.schema+ ')');
var parallelAxis = eval('(' +window.external.parallelAxis+ ')');
var legend = eval('(' +window.external.legend+ ')');

option = {
    backgroundColor: '#333',
    legend: legend,
	series : dataSeries,
	parallelAxis: parallelAxis,
    
    parallel: {
        left: '5%',
        right: '18%',
        bottom: 100,
        parallelAxisDefault: {
            type: 'value',
            name: 'AQI指数',
            nameLocation: 'end',
            nameGap: 20,
            nameTextStyle: {
                color: '#fff',
                fontSize: 12
            },
            axisLine: {
                lineStyle: {
                    color: '#aaa'
                }
            },
            axisTick: {
                lineStyle: {
                    color: '#777'
                }
            },
            splitLine: {
                show: false
            },
            axisLabel: {
                textStyle: {
                    color: '#fff'
                }
            }
        }
    },
}


// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
}
</script>

</body>

